/* 身体box */
.bodybox {
    padding-top: 105px;
}

/* 身体版心 */
.bdbx {
    width: 1200px;
    margin: auto;
    text-align: center;
}

/* 标题 */
.bdbx h1 {
    font-weight: 500;
}

/* 身体导航栏 */
.bodynav {
    display: flex;
    margin: auto;
    justify-content: center;
    margin-top: 52px;
    align-items: center;

}

.bodynav a {
    font-size: 18px;
    padding: 20px 27px;
}

/* 底下的一条横线 */
.bodynav span {
    border-bottom: 3px solid #ff6a00;
}

.bodynav a:hover {
    color: #ff6a00;
    font-weight: 600;
}

/* 第一个选上样式 */
.bodynav :nth-child(1) {
    color: #ff6a00;
    font-weight: 600;
}

/* <!-- 导航栏里的内容 --> */
.navcon {
    margin-top: 65px;
    display: flex;
    flex-direction: row;
    /* justify-content: center;
    align-items: center; */
}

/* 大图 */
.conimg {
    width: 60%;
    height: 433px;
    background: url('../img/work.ff99386c.png') no-repeat;
    background-size: contain;
    position: relative;
}

/* 大图里的两个小标 */
.simg1 {
    width: 191px;
    height: 70px;
    background: url('../img/scene1-1.a02a04d2.png') no-repeat;
    background-size: 100% auto;
    display: inline-block;
    position: absolute;
    top: -38px;
    left: -6px;
}

/* 橘色闪的小圆 */
.bigcircle {
    position: absolute;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    top: 43px;
    right: 19px;
    border: 1px solid #ff6933;
}

/* 中间小一点的圆 */
.bigcircle::before {
    content: "";
    position: absolute;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    top: 2px;
    left: 2px;
    background-color: rgba(255, 101, 5, 0.6);
    box-shadow: 0 0 10px rgba(255, 89, 0, 1);

}

/* 再小一点的圆 */
.bigcircle::after {
    content: "";
    position: absolute;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    top: 7px;
    left: 7px;
    background-color: rgba(255, 89, 0, 0.8);
}

@keyframes bigcircle-show {
    0% {
        opacity: 0
    }

    ;

    33% {
        opacity: 0
    }

    ;

    66% {
        opacity: 1
    }

    ;

    to {
        opacity: 1
    }

    ;
}

.bigcircle-act {
    animation: bigcircle-show 1s steps(3) infinite;
}

/* 第二张图 */
.simg2 {
    width: 146px;
    height: 72px;
    background: url('../img/scene1-2.b38ac0e4.png') no-repeat;
    background-size: 100% auto;
    display: inline-block;
    position: absolute;
    bottom: 170px;
    right: 58px;
}

.big {
    top: 5px;
    left: 19px;
}

@keyframes show-hide {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.img-show-hide {
    /* 上面命名的名字 */
    animation-name: show-hide;
    /* 动画执行一共2秒 */
    animation-duration: 2s;
    /* 反复执行 */
    animation-iteration-count: 1;
}

/* 具体内容 */
.contitle {
    width: 430px;
    text-align: left;
    font-weight: 400;
}

.contitle h2 {
    font-size: 28px;
    font-weight: 400;

}

/* 第一个字下面的横线 */
.contitle h2 span {
    border-bottom: 2px solid #ff6a00;

}

.contitle p {
    margin-top: 20px;
    line-height: 27px;
}

.contitle ul {
    margin-top: 20px;
}

.contitle ul li {
    width: 40%;
    display: inline-block;
    padding: 8px 20px;
}

/* 圆点 */
.yuan {
    display: inline-block;
    border: 3px solid #333;
    background-color: #333;
    border-radius: 50%;
    position: relative;
    top: -3px;
    margin-right: 5px;
}

/* 下面的小logo */
.consmall {
    width: 100%;
    margin-top: 55px;
}

.consmall img {
    width: 100px;
    height: 40px;
}
.moregoods{
    position: relative;
}
/* 更多优秀案例 */
.moregoods h1 {
    font-size: 22px;
    font-weight: 400;
}
/* 上一页 */
.moreshang{
    width: 45px;
    height: 45px;
    border-radius: 50px;
    box-shadow: 0 0 10px rgb(0 0 0 / 8%);
    position: absolute;
    top: 200px;
    left: -95px;
    cursor: pointer;
}
.moreshang:hover{
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);

   }
.icon-shangyiyehoutuifanhui::before{
    font-size: 24px;
    position: absolute;
    top: 10px;
    right: 10px;
    color: #ebf0f8;
}
.moreshang:hover .icon-shangyiyehoutuifanhui::before{
    color: #999;
}
/* 更多优秀案例的box */
.mgbox{
    width: 1200px;
    height: 420px;
    position: relative;
    /* margin: 100px auto; */
    overflow: hidden; 
    /* 超出本分隐藏，留下第一次看到的内容 */
}
.moregoodsbox {
    display: flex;
    align-items: center;
    margin-top: 30px;
    margin-bottom: 60px;
    position: absolute;
    transition: left 3s;
}

/* 大白框 */
.morebox {
    width: 270px;
    height: 330px;
    border-radius: 10px;
    background-color: #ffffff;
    box-shadow: 0 0 10px rgb(0 0 0 / 8%);
    margin: 0 15px;
}

/* 添加阴影 */
.morebox:hover {
    box-shadow: 0 0 30px rgba(0, 0, 0, 20%);

}

.moreimg {
    width: 252px;
    height: 189px;
    margin-top: 10px;
}

.morebox a {
    margin-top: 14px;
    font-size: 14px;
    text-align: left;
    margin-left: 10px;
}

.know {
    color: #0066ff;
}

.morelogo {
    display: block;
    height: 24px;
    margin-top: 30px;
}

/* 小米logo */
.mo1 {
    height: 30px;
}
/* 下一页 */
.morexia{
    width: 45px;
    height: 45px;
    border-radius: 50px;
    position: absolute;
    top: 200px;
    right: -95px;
    cursor: pointer;
}
.morexia:hover{
    box-shadow: 0 0 20px rgb(0 0 0 / 0.2);

   }
.icon-xiayiyeqianjinchakangengduo::before{
    font-size: 24px;
    position: absolute;
    top: 10px;
    right: 10px;
    color: #ebf0f8;
}
.morexia:hover .icon-xiayiyeqianjinchakangengduo::before{
    color: #999;
}
/* 联系合作 */
.callmeto {
    width: 350px;
    align-items: center;
    text-align: center;
    margin: auto;
    margin-bottom: 110px;
}

.callmeto a {
    font-size: 22px;
    color: #ff6933;
    font-weight: 600;
    border: 1px solid #ff6933;
    margin: auto;
    padding: 20px 45px;
    border-radius: 4px;
    cursor: pointer;
    margin-left: 70px;
}

/* 联系合作图标 */
.callmeto i {
    font-size: 22px
}

.callmeto a:hover {
    background-color: #ffe9e1;
}

/* 底部box */
.bottombox {
    width: 100%;
    background: rgba(243, 247, 252, .9);
}

/* 底部版心 */
.bottombx {
    width: 1200px;
    height: 220px;
    margin: auto;
}

/* <!-- 底部的最头上 -->  */
.lowtop {
    width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
    border-bottom: 1px solid #ebf0f8;
}

/* 底部logo */
.bottomlogo {
    width: 150px;
    margin-left: 30px;
}

/* 文字 */
.lowtext {
    display: flex;
    flex-direction: row;
    text-align: left;
    margin-right: 128px;
}

.text1 {
    margin-right: 60px;
    color: rgba(59, 62, 62, .8);
    font-size: 14px;
    font-weight: 600;
    line-height: 26px;
}

.text1 t2 {
    margin-right: 10px;
}

.text1 a {
    display: inline-block;
    color: rgba(59, 62, 62, .8);
}

/* 两个二维码 */
.lowimgbox {
    display: flex;
    flex-direction: row;
}

.lowimgbox img {
    width: 64px;
    height: 64px;
}

.imgbox1 {
    display: flex;
    flex-direction: column;
    padding: 0 14px;
}

.imgbox1 span {
    font-size: 12px;
    margin: 6px auto;

}

/* 最底部认证 */
.last {
    margin: auto;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    color: rgba(59, 62, 62, .8);
    margin: 40px auto;
}

.last a {
    font-size: 12px;
    font-weight: 600;
    display: inline-block;
    color: rgba(59, 62, 62, .8);
}